<template>
	<div class="xitongpeizhi">
    <div v-if="!shoujiban">
      <left></left>
      <div class="right">
        <div style="height: 91px; border-bottom: 1px solid rgb(227, 232, 241); width: 100%; padding: 0 30px;" class="flexbc">
          <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/xitongpeizhi' }">系统管理</el-breadcrumb-item>
            <el-breadcrumb-item>系统配置</el-breadcrumb-item>
          </el-breadcrumb>
          <top></top>
        </div>
        <div style="padding: 37px 30px 60px 30px; height: calc(100vh - 91px); overflow: auto;">
          <!-- 1 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin-bottom: 20px;">
            <div><img src="../../../static/img/xitong3.png" style="width: 22px; margin-right: 10px;"></div>
            <div>系统信息设置</div>
          </div>
          <div class="baibeijing" style=" width: 780px; margin-bottom: 20px;">
            <el-form ref="form" :model="form">
              <el-form-item>
                <div><span class="bitian">*</span>店铺名称</div>
                <div><el-input v-model="form.shop_name" style="width: 360px;"></el-input></div>
              </el-form-item>
              <el-form-item>
                <div>备案信息</div>
                <div><el-input v-model="form.icp" style="width: 360px;"></el-input></div>
              </el-form-item>
              <div class="flex">
                <el-form-item style="margin-right: 20px;">
                  <div>设置左上角LOGO</div>
                  <div><chuantu :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.left_logo" @getimg="getimg4" v-if="relo"></chuantu></div>
                  <div style="font-size: 12px; color: rgb(158, 158, 158);">像素尺寸：L300×H90</div>
                </el-form-item>
                <el-form-item style="margin-right: 20px;">
                  <div>登录页LOGO</div>
                  <div><chuantu :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.system_logo" @getimg="getimg" v-if="relo"></chuantu></div>
                  <div style="font-size: 12px; color: rgb(158, 158, 158);">像素尺寸：1:1正方形</div>
                </el-form-item>
                <el-form-item>
                  <div>登录页背景图</div>
                  <div><chuantu4 :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.login_background" @getimg="getimg2" v-if="relo"></chuantu4></div>
                  <div style="font-size: 12px; color: rgb(158, 158, 158);">建议：L1920×H1080</div>
                </el-form-item>
              </div>
            </el-form>
          </div>

          <!-- 3 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin-bottom: 20px;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>分销功能设置</div>
          </div>


          <div class="baibeijing" style=" width: 780px; margin-bottom: 20px;">
            <div class="flexc">
              <div>选择允许的最大分销层级</div>
              <el-popover
                placement="top-start"
                trigger="hover"
                content="该系统支持的最大分销层数，2级表示只有您和您的直接分销商，增加层级依次增加，最末层分销商无法邀请下级分销商">
                <div slot="reference" class="t_wen">?</div>
              </el-popover>
            </div>
            <el-select style="margin-top: 15px;margin-bottom: 30px;width: 300px;" v-model="form.limit_level" placeholder="请选择">
              <el-option label="2层" :value="2"></el-option>
              <el-option label="3层" :value="3"></el-option>
              <el-option label="4层" :value="4"></el-option>
              <el-option label="5层" :value="5"></el-option>
            </el-select>

            <div class="flexc" style=" margin-bottom: 20px;">
              <div>允许分销商邀请他人成为其下级分销商：</div>
              <div><el-switch v-model="form.reseller_inv_switch"  style="width: 46px; height: 21px;" active-color="rgb(0, 90, 255);" inactive-color="rgb(246, 248, 251);" :active-value="1" :inactive-value="0"></el-switch></div>
              <div>
                <el-popover
                  placement="top-start"
                  trigger="hover"
                  content="您的分销商可以邀请他人成为其下级分销商，邀请根据您设置的分销层级，最末端的层级没有邀请链接">
                  <div slot="reference" class="t_wen">?</div>
                </el-popover>
              </div>
            </div>
            <div class="flexc" style=" margin-bottom: 20px;">
              <div>C端微小店销售页的加盟悬浮按钮：</div>
              <div><el-switch v-model="form.join_switch" @change="changeri" style="width: 46px; height: 21px;" active-color="rgb(0, 90, 255);" inactive-color="rgb(246, 248, 251);" :active-value="1" :inactive-value="0"></el-switch></div>
              <div>
                <el-popover
                  placement="top-start"
                  trigger="hover"
                  content="所有的用户端微小店的销售页会显示加盟悬浮按钮，任何用户可以通过此注册成为分销商">
                  <div slot="reference" class="t_wen">?</div>
                </el-popover>
              </div>
              <div  class="flexc" style="margin-left: 20px;" v-if="form.join_switch == 1">
                <div style="margin-right: 20px;"><el-checkbox v-model="form.force_join_switch" :true-label="1"  :false-label="0">强制所有页面开启</el-checkbox></div>
                <div style="color: rgb(175, 179, 188); font-size: 12px;">强制开启后，您的分销商将无法关闭该按钮</div>
              </div>
            </div>

            <div style=" margin-bottom: 40px;">
              <el-radio v-model="form.reseller_join_inv_switch" :label="0">所有通过C端加盟分销的用户都成为我的直接分销商</el-radio>
              <el-radio v-model="form.reseller_join_inv_switch" :label="1">用户在谁的销售页加盟分销就成为谁的下级分销商</el-radio>
            </div>
            <div style="margin-bottom: 30px;">分销商注册限制设置</div>
            <div>
                <el-radio v-model="form.distributor" label="0">任何人可以注册为我的分销商</el-radio>
                <el-radio v-model="form.distributor" label="1">需邀请码才注册成为我的分销商</el-radio>
            </div>
            <div style="margin-top: 22px;margin-bottom: 15px;color: #8D8E8F;font-size: 14px;">我的分销商注册邀请码</div>
            <div class="flexc" >
              <div class="flexc" style="background: rgb(246, 248, 251);border: 1px solid rgb(227, 232, 241);border-radius: 20.5px; height: 41px; margin-right: 10px;">
                <div style="padding: 0 20px; color: rgb(175, 179, 188); font-size: 14px;">邀请码</div>
                <div style="width: 160px; font-size: 14px; color: rgb(2, 12, 29);">{{yaoqingma}}</div>
                <i  style="padding: 0 20px; cursor: pointer;" class="el-icon-refresh-right" @click="gengxinyaoqingma"></i>
              </div>
              <div><el-button type="primary" plain round @click="copy(yaoqingma)">复制</el-button></div>
            </div>
          </div>
                    <!-- <div class="flexc" style="margin-top: 30px;">
                      <div>中间层分销商佣金抽成比例设置</div>
                      <el-popover
                        placement="top-start"
                        trigger="hover">
                          <div>设置处于分销中间层的分销抽成金额，例如：3层分销，商品佣金为100，</div>
                          <div>此处分成比例设置10%，则第3层发展的订单可以获得90元佣金，第二层作为中间层获得抽成的10元。</div>
                          <div>如果为5层分销，则第5层发展的订单获得70元佣金，中间的2、3、4层每层获得抽成的10元。</div>
                        <div slot="reference" class="t_wen">?</div>
                      </el-popover>
                    </div>
                    <div style="margin-top: 25px;"><el-input class="t_bf_input" type="number"
              oninput="if(value<0)value=0" v-model="form.agent_fee_percent" style="width: 300px; margin-right: 20px;" placeholder="请输入比例数字"><template slot="append">%</template></el-input></div>
                    <div class="t_tips">注：计算出的金额带小数则四舍五入去除</div> -->

        <!-- 4 -->




            <!-- <div class="flexc" style="margin-top: 30px;">
              <div>中间层分销商佣金抽成比例设置</div>
              <el-popover
                placement="top-start"
                trigger="hover">
                  <div>设置处于分销中间层的分销抽成金额，例如：3层分销，商品佣金为100，</div>
                  <div>此处分成比例设置10%，则第3层发展的订单可以获得90元佣金，第二层作为中间层获得抽成的10元。</div>
                  <div>如果为5层分销，则第5层发展的订单获得70元佣金，中间的2、3、4层每层获得抽成的10元。</div>
                <div slot="reference" class="t_wen">?</div>
              </el-popover>
            </div>
              <div style="margin-top: 25px;"><el-input class="t_bf_input" type="number"
              oninput="if(value<0)value=0" v-model="form.agent_fee_percent" style="width: 300px; margin-right: 20px;" placeholder="请输入比例数字"><template slot="append">%</template></el-input></div>
              <div class="t_tips">注：计算出的金额带小数则四舍五入去除</div> -->
            <!-- </div> -->
          <!-- 4 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin-bottom: 20px;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>联系客服设置</div>
          </div>



          <div class="baibeijing" style=" width: 780px; margin-bottom: 20px;">

            <!-- 微小店页面“联系客服”信息设置  -->
            <div style="margin-bottom: 20px;" class="flexc">
              <div>微小店页面“联系客服”信息设置 </div>

              <el-popover  placement="top-start"  trigger="hover" >
                <div><img src="../../../static/img/lianxikefuw.png" style="width: 300px;"></div>

                <div slot="reference" class="t_wen">?</div>
              </el-popover>


            </div>
            <div>
              <div class="flexc">
                <div style="margin-right: 20px;"><el-radio v-model="form.cust_switch" :label="0">允许各分销商单独设置联系客服信息</el-radio></div>
                <div style="margin-right: 20px; margin-bottom: 20px;"><el-checkbox v-model="form.use_cust_switch" :true-label="1"  :false-label="0">分销商未设置则使用我的联系客服信息</el-checkbox></div>
              </div>

              <el-radio v-model="form.cust_switch" :label="1" @change="changecust">统一使用使用我的联系客服信息</el-radio>
            </div>
            <!-- 微小店页面“联系客服”信息设置  -->

            <div style="margin-bottom: 20px;">我的联系客服信息：</div>
            <!-- <div class="flexc">
              <div><el-input v-model="form.mobile" style="width: 360px; margin-right: 20px;"></el-input></div>
            </div> -->
            <div class="flex">
              <div style="width: 100px;">
                <div style="margin: 10px 0; color: rgb(109, 109, 109);">二维码上传</div>
                <div ><chuantu :widths="'100px'" :heights="'100px'" :widths2="'100px'" :heights2="'100px'" :imgs="form.qrcode" @getimg="getimg3" v-if="relo"></chuantu></div>
              </div>
              <div style="margin-left: 50px;">
                <div style="margin: 10px 0; color: rgb(109, 109, 109);">联系客服跳转链接</div>
                <div><el-input v-model="form.cust_link" style="width: 260px; margin-right: 20px;" placeholder="请输入企微生成的联系客服链接"></el-input></div>
              </div>
            </div>

          </div>

          <div style="position: fixed; bottom: 0; left: 300px; background: #fff; width: calc(100vw - 300px); padding: 15px 0; z-index: 999;" class="flexcc"><el-button type="primary" style=" width: 140px;" round @click="baocunpeizhi">保存</el-button></div>

          <!-- 2 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>绑定的敢探号店铺设置</div>
          </div>
          <div class="baibeijing" style=" width: 780px; margin-bottom: 50px;">

            <div class="flexc">
              <div style="font-size: 16px; font-weight: bold;">我的系统秘钥</div>
              <div style="margin-left: 20px; cursor: pointer;"><img src="../../../static/img/biyan.png" style="width: 20px;" v-if="biyan" @click="zhengyan" /></div>
              <div style="margin-left: 20px; cursor: pointer;"><img src="../../../static/img/zhengyan.png" style="width: 20px;" v-if="!biyan" @click="biyan2" /></div>
            </div>

            <div style="margin: 10px 0;">{{xitongmiyao}}</div>

            <div v-if="yibangding">已绑定敢探号店铺</div>
            <div class="flex" style="background: rgb(246, 248, 251); border-radius: 5px; width: 210px; font-size: 12px; padding: 10px;" v-if="!yibangding">
              <div style="color: rgb(175, 179, 188); margin-right: 10px;">还未绑定敢探号店铺</div>
              <div style="color: rgb(0, 90, 255); cursor: pointer;" @click="xianshi = !xianshi">绑定店铺</div>
            </div>

            <div v-if="xianshi"  style="margin: 10px 0; font-weight: bold; margin-top: 20px;" class="flexc"><span class="bitian">*</span>敢探号店铺秘钥  <div style="color: rgb(0, 90, 255); font-size: 12px; margin-left: 20px; font-weight: 100;" @click="ruhe_log = true">如何获取敢探号秘钥？</div></div>
            <div v-if="xianshi">
              <div><el-input v-model="gthid" style="width: 180px; margin-top: 10px;" placeholder="输入share_id"></el-input></div>
              <div><el-input v-model="gthtoken" style="width: 180px; margin-top: 20px;" placeholder="输入api_token"></el-input></div>
              <div><el-button type="primary" round plain @click="gengxingthtoken" style="margin-top: 20px;">确定绑定</el-button></div>
            </div>
          </div>


          <!-- 2 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>附加功能</div>
          </div>
          <div class="baibeijing" style=" width: 780px; margin-bottom: 50px;">
            <div class="flexc">
              <div>物流轨迹查询功能（收费）</div>
              <div><el-switch v-model="form.track" @change="changewuliu" style="width: 85px; height: 41px;"  :active-value="1" :inactive-value="0"></el-switch></div>
            </div>
            <div style="color: rgb(175, 179, 188); font-size: 14px;">该功能查询0.028元/订单，30天周期内反复查询同一订单仅扣费一次，开通后您和您的分销商均可用。</div>
          </div>
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
          <div><img src="../../../static/img/yzh.png" style="width: 22px; margin-right: 10px;"></div>
          <div>云账户支付</div>
        </div>
        <div class="baibeijing" style=" width: 780px; margin-bottom: 50px;" v-if="this.apply.status!=7&&this.pay.status!=1">
          <div>您还未配置云账户</div>
          <div class="flexc" >
            <div class="flexc" style="margin-top:15px;margin-bottom:15px">
              <div style="width: 130px;">我还没有云账户：</div>
              <div v-if="this.apply==''" @click="toregyzh(1)" class="t_yzh">注册云账户</div>
              <div v-if="this.apply.status==0" style="color: #949494;font-size: 14px;">未提交</div>
              <div v-if="this.apply.status==1" style="color: #949494;font-size: 14px;">已提交</div>
              <div v-if="this.apply.status==2" style="font-size: 14px;"><span style="color: #FF0000;">申请驳回</span></div>
              <div v-if="this.apply.status==3" style="color: #949494;font-size: 14px;">开户成功待签署</div>
              <div v-if="this.apply.status==3"><span @click="tosign" style="color: #005AFF;margin-left: 10px;cursor: pointer;" >点击进行签署</span></div>
              <div v-if="this.apply.status==4" style="color: #949494;font-size: 14px;">签约成功待开通服务</div>
              <div v-if="this.apply!=''"><span @click="toregyzh(2)" style="color: #005AFF;margin-left: 10px;cursor: pointer;" >进入查看</span></div>
              <div v-if="this.apply!=''" @click="refrestate()" class="t_yzh" style="margin-left: 5px;">更新状态</div>
            </div>
            <div class="flexc" style="margin-left: 77px;">
              <div style="width: 130px;">我已有云账户：</div>
              <div v-if="this.apply.status==0" style="color: #949494;font-size: 14px;">未验证</div>
              <div v-if="this.pay==''||this.pay.status==0" @click="tohavebind(1)" class="t_yzh">绑定云账户</div>
            </div>
          </div>
          <div style="background-color: #F3F4F7;color: #828282;padding: 15px;border-radius: 13px;font-size: 14px;">
            云账户是一个第三方的灵活用工平台，可以在企业和自由职业者之间搭建桥梁。 企业可以将佣金发放的工作交给云账户，由云账户来帮灵活就业人员申报个人所得税
          </div>
        </div>
        <div v-if="this.apply.status==7||this.pay.status==1" class="baibeijing" style=" width: 780px; margin-bottom: 50px;">
          <div>当前已配置云账户：</div>
          <div @click="tohavebind(2)" style="color: #004AFF;margin-top: 15px;margin-bottom: 15px;cursor: pointer;" >{{ nowbind.dealer_id }}</div>
          <div v-if="nowbind.status==0" @click="checkmoney" class="t_yzh" style="width: 120px;text-align: center;margin-bottom: 15px">请进行打款验证</div>
          <div style="color: #CDCDCD;font-size: 14px;" >修改云账户请联系客服处理</div>
        </div>

        <!-- 2 -->
        <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
          <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
          <div>短信签名设置</div>
        </div>
        <div class="baibeijing" style=" width: 780px; margin-bottom: 50px;">
          <div class="flexc">
            <div><span class="bitian">*</span>已设置短信签名：
              <span v-if="qianminglist.status_name == '已通过'">已设置</span>
              <span v-if="qianminglist.status_name != '已通过'">未设置</span>
            </div>
          </div>
          <div class="flexc" style="color: rgb(148, 148, 148); font-size: 12px; margin-top: 20px;" >
            <div style="margin-right: 20px;">新的签名：{{qianminglist.title}}</div>
            <div style="margin-right: 20px;">审核状态：{{qianminglist.status_name}}</div>
            <div v-if="qianminglist.reason">原因：{{qianminglist.reason}}</div>
          </div>
          <div style="margin-top: 20px;">新增/修改签名：</div>
          <div style="margin-top: 20px;"><el-input v-model="qianming.title" style="width: 260px; margin-right: 20px;" placeholder="请输入签名"></el-input></div>
          <div><el-button type="primary" plain style="margin-top: 20px; width: 140px;" round @click="tijiaoshenhe">提交审核</el-button></div>
          <div style="color: rgb(148, 148, 148); font-size: 12px; margin-top: 20px;">该短信签名主要用于分销商注册收验证码，请设置为与自身企业或商标相关，像“分销系统”等无品牌名的宽泛用词无法通过。</div>
        </div>

		<!-- <footers></footers> -->
      </div>
    </div>
    </div>


    <el-dialog title="如何获取敢探号秘钥" :visible.sync="ruhe_log" width="1440px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div>
        <div style="color: rgb(93, 93, 93); margin-bottom: 10px; color: rgb(0, 90, 255);">主账号登录敢探号在右上角个人中心页面中找到敢探号秘钥，点击获取秘钥，输入密码后按照对应字段信息填写。</div>
        <img src="../../../static/img/xitong6.png" style="width: 100%;">
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="ruhe_log = false">关闭</el-button>
      </span>
    </el-dialog>
    <div v-if="shoujiban" style=" color: rgb(2, 12, 29); font-size: 0.24rem; background: #f6f8fb; padding-top: 1rem;">
      <topandleft></topandleft>
      <div style="background: #fff; padding: 0.3rem;">
        <div class="flexc" style="margin-bottom: 0.3rem;">
          <div style="width: 2px; height: 0.2rem; background: rgb(2, 12, 29); margin-right: 10px; overflow: hidden;"></div>
          <div style="font-size: 0.36rem; font-weight: bold;">系统管理</div>
        </div>
        <div class="flexc" style="margin-bottom: 0.3rem;">
          <div style="color: rgb(175, 179, 188);">首页</div>
          <div style="margin: 0 0.2rem;color: rgb(175, 179, 188);">·</div>
          <div style="color: rgb(175, 179, 188);">系统管理</div>
          <div style="margin: 0 0.2rem;color: rgb(175, 179, 188);">·</div>
          <div>系统配置</div>
        </div>
      </div>
      <div style="padding: 0.3rem;">

        <div class="baibeijing">
         <div style="margin-bottom: 0.2rem; position: relative;"><span class="bitian" style="position: absolute; left: -0.2rem; top: 10px;">*</span><el-input v-model="form.shop_name" style="width: 100%;" placeholder="店铺名称"></el-input></div>
         <div style="margin-bottom: 0.2rem;"><el-input v-model="form.icp" style="width: 100%;" placeholder="备案信息"></el-input></div>
            <div  style="padding: 0.2rem 0; ">

                <div>设置左上角LOGO</div>
                <div style="width: 100px; margin: 0.3rem;"><chuantu :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.left_logo" @getimg="getimg4" v-if="relo"></chuantu></div>
                <div style="font-size: 12px; color: rgb(158, 158, 158);">像素尺寸：L300×H90</div>
            </div>
            <div  style="padding: 0.2rem 0; ">
                <div>登录页LOGO</div>
                <div style="width: 100px; margin: 0.3rem;"><chuantu :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.system_logo" @getimg="getimg" v-if="relo"></chuantu></div>
                <div style="font-size: 12px; color: rgb(158, 158, 158);">像素尺寸：1:1正方形</div>
            </div>
            <div  style="padding: 0.2rem 0; ">

                <div>登录页背景图</div>
                <div style="width: 100px; margin: 0.3rem;"><chuantu :widths="'100px'" :widths2="'100px'" :heights2="'100px'" :heights="'100px'" :buyaoshanchu="true" :imgs="form.login_background" @getimg="getimg2" v-if="relo"></chuantu></div>
                <div style="font-size: 12px; color: rgb(158, 158, 158);">建议：L1920×H1080</div>

            </div>

        </div>
        <div class="baibeijing" style="margin-top: 0.5rem;">
              <div class="flexc">
                <div>选择允许的最大分销层级</div>
                <el-popover
                  placement="top-start"
                  trigger="hover"
                  content="该系统支持的最大分销层数，2级表示只有您和您的直接分销商，增加层级依次增加，最末层分销商无法邀请下级分销商">
                  <div slot="reference" class="t_wen">?</div>
                </el-popover>
              </div>
              <el-select style="margin-top: 15px;margin-bottom: 30px;width: 300px;" v-model="form.limit_level" placeholder="请选择">
                <el-option label="2层" :value="2"></el-option>
                <el-option label="3层" :value="3"></el-option>
                <el-option label="4层" :value="4"></el-option>
                <el-option label="5层" :value="5"></el-option>
              </el-select>

              <div class="flexc" style=" margin-bottom: 20px;">
                <div>允许分销商邀请他人成为其下级分销商：</div>
                <div><el-switch v-model="form.reseller_inv_switch"  style="width: 46px; height: 21px;" active-color="rgb(0, 90, 255);" inactive-color="rgb(246, 248, 251);" :active-value="1" :inactive-value="0"></el-switch></div>
                <div>
                  <el-popover
                    placement="top-start"
                    trigger="hover"
                    content="您的分销商可以邀请他人成为其下级分销商，邀请根据您设置的分销层级，最末端的层级没有邀请链接">
                    <div slot="reference" class="t_wen">?</div>
                  </el-popover>
                </div>
              </div>
              <div class="flexc" style=" margin-bottom: 20px;">
                <div>C端微小店销售页的加盟悬浮按钮：</div>
                <div><el-switch v-model="form.join_switch" @change="changeri" style="width: 46px; height: 21px;" active-color="rgb(0, 90, 255);" inactive-color="rgb(246, 248, 251);" :active-value="1" :inactive-value="0"></el-switch></div>
                <div>
                  <el-popover
                    placement="top-start"
                    trigger="hover"
                    content="所有的用户端微小店的销售页会显示加盟悬浮按钮，任何用户可以通过此注册成为分销商">
                    <div slot="reference" class="t_wen">?</div>
                  </el-popover>
                </div>
              </div>
              <div style=" margin-bottom: 20px;" class="flexc" v-if="form.join_switch == 1">
                <div style="margin-right: 20px;"><el-checkbox v-model="form.force_join_switch" :true-label="1"  :false-label="0">强制所有页面开启</el-checkbox></div>
                <div style="color: rgb(175, 179, 188); font-size: 12px;">强制开启后，您的分销商将无法关闭该按钮</div>
              </div>
              <div style=" margin-bottom: 40px;" class="fz12">
                <el-radio v-model="form.reseller_join_inv_switch" :label="0">所有通过C端加盟分销的用户都成为我的直接分销商</el-radio>
                <el-radio v-model="form.reseller_join_inv_switch" :label="1">用户在谁的销售页加盟分销就成为谁的下级分销商</el-radio>
              </div>


              <div style="margin-bottom: 30px;">分销商注册限制设置</div>
              <div>
                  <el-radio v-model="form.distributor" label="0">任何人可以注册为我的分销商</el-radio>
                  <el-radio v-model="form.distributor" label="1">需邀请码才注册成为我的分销商</el-radio>
              </div>
              <div style="margin-top: 22px;margin-bottom: 15px;color: #8D8E8F;font-size: 14px;">我的分销商注册邀请码</div>
              <div class="flexc" >
                <div class="flexc" style="background: rgb(246, 248, 251);border: 1px solid rgb(227, 232, 241);border-radius: 20.5px; height: 41px; margin-right: 10px;">
                  <div style="padding: 0 20px; color: rgb(175, 179, 188); font-size: 14px;">邀请码</div>
                  <div style="width: 160px; font-size: 14px; color: rgb(2, 12, 29);">{{yaoqingma}}</div>
                  <i  style="padding: 0 20px; cursor: pointer;" class="el-icon-refresh-right" @click="gengxinyaoqingma"></i>
                </div>
                <div style="margin-top: 0.2rem;"><el-button type="primary" plain round @click="copy(yaoqingma)">复制</el-button></div>
              </div>
              <!-- <div class="flexc" style="margin-top: 30px;">
                <div>中间层分销商佣金抽成比例设置</div>
                <el-popover
                  placement="top-start"
                  trigger="hover">
                    <div>设置处于分销中间层的分销抽成金额，例如：3层分销，商品佣金为100，</div>
                    <div>此处分成比例设置10%，则第3层发展的订单可以获得90元佣金，第二层作为中间层获得抽成的10元。</div>
                    <div>如果为5层分销，则第5层发展的订单获得70元佣金，中间的2、3、4层每层获得抽成的10元。</div>
                  <div slot="reference" class="t_wen">?</div>
                </el-popover>
              </div>
              <div style="margin-top: 25px;"><el-input class="t_bf_input" type="number"
        oninput="if(value<0)value=0" v-model="form.agent_fee_percent" style="width: 300px; margin-right: 20px;" placeholder="请输入比例数字"><template slot="append">%</template></el-input></div>
              <div class="t_tips">注：计算出的金额带小数则四舍五入去除</div> -->
            </div>

          <!-- 4 -->
          <div class="flexc" style="font-size: 16px; margin-top: 0.2rem; font-weight: bold; margin-bottom: 20px;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>联系客服设置</div>
          </div>


          <!-- <div class="baibeijing" >
            <div><el-input v-model="form.mobile" style="width: 100%;" placeholder="联系电话"></el-input></div>
            <div style="width: 100px;">
              <div style="margin: 10px 0;">二维码</div>
              <div ><chuantu :widths="'100px'" :heights="'100px'" :widths2="'100px'" :heights2="'100px'" :imgs="form.qrcode" @getimg="getimg3" v-if="relo"></chuantu></div>
            </div>
          </div> -->

          <div class="baibeijing" style=" margin-bottom: 20px;">

            <!-- 微小店页面“联系客服”信息设置  -->
            <div style="margin-bottom: 20px;">微小店页面“联系客服”信息设置 </div>
            <div>
              <div class="flexc">
                <div style="margin-right: 20px;"><el-radio v-model="form.cust_switch" :label="0">允许各分销商单独设置联系客服信息</el-radio></div>
                <div style="margin-right: 20px; margin-bottom: 20px;"><el-checkbox v-model="form.use_cust_switch" :true-label="1"  :false-label="0">分销商未设置则使用我的联系客服信息</el-checkbox></div>
              </div>

              <el-radio v-model="form.cust_switch" :label="1">统一使用使用我的联系客服信息</el-radio>
            </div>
            <!-- 微小店页面“联系客服”信息设置  -->

            <div style="margin-bottom: 20px;">我的联系客服信息：</div>
            <!-- <div class="flexc">
              <div><el-input v-model="form.mobile" style="width: 360px; margin-right: 20px;"></el-input></div>
            </div> -->
            <div class="flex">
              <div style="width: 100px;">
                <div style="margin: 10px 0; color: rgb(109, 109, 109);">二维码上传</div>
                <div ><chuantu :widths="'100px'" :heights="'100px'" :widths2="'100px'" :heights2="'100px'" :imgs="form.qrcode" @getimg="getimg3" v-if="relo"></chuantu></div>
              </div>
              <div >
                <div style="margin: 10px 0; color: rgb(109, 109, 109);">联系客服跳转链接</div>
                <div><el-input v-model="form.cust_link" style="width: 260px; margin-right: 20px;" placeholder="请输入企微生成的联系客服链接"></el-input></div>
              </div>
            </div>

          </div>


          <div><el-button type="primary" style="margin-top: 40px; width: 140px;" round @click="baocunpeizhi">保存</el-button></div>

          <!-- 2 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>绑定的敢探号店铺设置</div>
          </div>
          <div class="baibeijing" >

            <div class="flexc">
              <div style="font-size: 16px; font-weight: bold;">我的系统秘钥</div>
              <div style="margin-left: 20px; cursor: pointer;"><img src="../../../static/img/biyan.png" style="width: 20px;" v-if="biyan" @click="zhengyan" /></div>
              <div style="margin-left: 20px; cursor: pointer;"><img src="../../../static/img/zhengyan.png" style="width: 20px;" v-if="!biyan" @click="biyan2" /></div>
            </div>

            <div style="margin: 10px 0;">{{xitongmiyao}}</div>

            <div v-if="yibangding">已绑定敢探号店铺</div>
            <div class="flex" style="background: rgb(246, 248, 251); border-radius: 5px; width: 210px; font-size: 12px; padding: 10px;" v-if="!yibangding">
              <div style="color: rgb(175, 179, 188); margin-right: 10px;">还未绑定敢探号店铺</div>
              <div style="color: rgb(0, 90, 255); cursor: pointer;" @click="xianshi = !xianshi">绑定店铺</div>
            </div>

            <div v-if="xianshi" style="margin: 10px 0; font-weight: bold; margin-top: 20px;" class="flexc"><span class="bitian">*</span>敢探号店铺秘钥<div style="color: rgb(0, 90, 255); font-size: 12px; margin-left: 20px; font-weight: 100;" @click="ruhe_log = true">如何获取敢探号秘钥？</div></div>
            <div v-if="xianshi">
              <div><el-input v-model="gthid" style="width: 180px; margin-top: 10px;" placeholder="输入share_id"></el-input></div>
              <div><el-input v-model="gthtoken" style="width: 180px; margin-top: 20px;" placeholder="输入api_token"></el-input></div>
              <div><el-button type="primary" round plain @click="gengxingthtoken" style="margin-top: 20px;">确定绑定</el-button></div>

            </div>
          </div>


          <!-- 2 -->
          <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
            <div><img src="../../../static/img/bianji1.png" style="width: 22px; margin-right: 10px;"></div>
            <div>附加功能</div>
          </div>
          <div class="baibeijing">
            <div class="flexc">
              <div>物流轨迹查询功能（收费）</div>
              <div><el-switch v-model="form.track" @change="changewuliu" style="width: 85px; height: 41px;"  :active-value="1" :inactive-value="0"></el-switch></div>
            </div>
            <div style="color: rgb(175, 179, 188); font-size: 14px;">该功能查询0.028元/订单，30天周期内反复查询同一订单仅扣费一次，开通后您和您的分销商均可用。</div>
          </div>
      </div>
    </div>
	</div>
</template>

<script>
  import left from '../left.vue'
  import top from '../top.vue'
  import footers from '../footer.vue'
  import chuantu from '@/components/chuantu.vue'
  import chuantu4 from '@/components/chuantu4.vue'

  import topandleft from '../topandleft.vue'
	export default {
		name: 'xitongpeizhi',
    components:{
      left,chuantu,top,topandleft,footers,chuantu4
    },
		data() {
			return {
        form:{},
        relo:true,
        xianshi:false,
        yaoqingma:"",
        apitoken:"",
        ruhe_log:false,
        biyan:true,
        xitongmiyao:"********",
        gthid:"",
        gthtoken:"",
        yibangding:false,
        user:"",
        apply:'',
        pay:'',
        nowbind:{},
        qianminglist:"",
        qianming:{
          title:""
        }
			}
		},
		created() {
      this.getpeizhi()
      this.getyaoqingma()
      this.getgthtoken()
      if(localStorage.getItem('user')){
        this.user = JSON.parse(localStorage.getItem('user'))
      }
      //获取云账户配置
      this.getyzhinfo()
      this.getqianminglist()

		},
		mounted() {
      if(window.screen.width < 1080){
        this.shoujiban = true
        var h = document.documentElement.clientWidth / 7.5 + 'px';
        document.documentElement.style.fontSize = h;

        // this.onLoad()
      }else{
        this.getlist()
      }
		},
		methods: {
      tijiaoshenhe:function(){
        axios.post('/own/system/sms-sign/arraign',{title:this.qianming.title}).then((response)=>{
          if (response.data.msg.code == 0) {
            this.$message.success('已提交审核，请等待审核结果');
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      },
      getqianminglist:function(){

        axios.get('/own/system/sms-sign/list').then((response)=>{
          if (response.data.msg.code == 0) {
            this.qianminglist = response.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      },
      getlogo:function(){
        axios.get('/api/logo').then((response)=>{
          if (response.data.msg.code == 0) {
            document.title = response.data.data.shop_name
            localStorage.setItem('shop_name',response.data.data.shop_name)
            localStorage.setItem('system_logo',response.data.data.system_logo)
            localStorage.setItem('left_logo',response.data.data.left_logo)
            localStorage.setItem('icp',response.data.data.icp)
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      },

      changecust:function(){
        if(this.form.cust_switch == 1){
          this.form.use_cust_switch = 0
        }
      },
      changeri:function(){
        if(this.form.join_switch == 0){
          this.form.force_join_switch = 0
        }
      },
      changewuliu:function(){
        axios.post('/own/system/config',{track:this.form.track}).then((response)=>{
        	if (response.data.msg.code == 0) {
            this.getpeizhi()
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      zhengyan:function(){
        this.xitongmiyao = this.form.apiToken
        this.biyan = false
      },
      biyan2:function(){
        this.xitongmiyao = "********"
        this.biyan = true
      },

      getimg:function(item){
        this.form.system_logo = item
      },
      getimg2:function(item){
        this.form.login_background = item
      },
      getimg3:function(item){
        this.form.qrcode = item
      },
      getimg4:function(item){
        this.form.left_logo = item
      },
      getpeizhi:function(){
        axios.get('/own/system/get').then((response)=>{
        	if (response.data.msg.code == 0) {
            this.form = response.data.data
            this.form.distributor = this.form.distributor.toString()
            this.relo = false
            this.$nextTick(()=>{
              this.relo = true
            })
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },

      getgthtoken:function(){
        // axios.get('/own/system/gthtoken/get').then((response)=>{
        // 	if (response.data.msg.code == 0) {
        //     this.gthtoken = response.data.data
        // 	} else {
        // 		this.$message.error(response.data.msg.info);
        // 	}
        // })

        axios.get('/own/sys/info').then((response)=>{
        	if (response.data.msg.code == 0) {
            if(response.data.data.gth_id){
              this.yibangding = true
            }

        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })

      },
      gengxingthtoken:function(){
        axios.post('/own/system/gth/update',{gth_id:this.gthid,gth_token:this.gthtoken}).then((response)=>{
        	if (response.data.msg.code == 0) {
            this.$message.success('绑定成功');
            this.getgthtoken()
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      getyaoqingma:function(){
        axios.get('/own/system/inv/get').then((response)=>{
        	if (response.data.msg.code == 0) {
            this.yaoqingma = response.data.data
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      gengxinyaoqingma:function(){
        axios.post('/own/system/inv/update').then((response)=>{
        	if (response.data.msg.code == 0) {
            this.getyaoqingma()
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      baocunpeizhi:function(){
        axios.post('/own/system/config',this.form).then((response)=>{
        	if (response.data.msg.code == 0) {
            this.$message.success('保存成功');
            this.getpeizhi()
            this.getlogo()
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      //注册云账户
      toregyzh(type){
        //1--注册
        //2--编辑
        this.$router.push({path:'/yzhregister',query:{type:type}})
      },
      //已有账户绑定
      tohavebind(type){
        this.$router.push({path:'/yzhbind',query:{type:type}})
      },
      //获取云账户配置
      getyzhinfo(){
        axios.post('/own/yunzhifu/getYunAccount',{site_id:this.user.site_id}).then((response)=>{
        	if (response.data.msg.code == 0) {
            console.log('获取云账户配置')
            console.log(response.data.data)
            this.apply = response.data.data.apply
            this.pay = response.data.data.pay
            // 是否绑定成功
            if(this.apply.status==7||this.pay.status==1){
                //获取详情
                this.getinfo()
            }
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      //获取详情
      getinfo(){
        axios.get('/own/yunzhifu/getApiToken',{
          params:{
            site_id:this.user.site_id
          }
        }).then((response)=>{
          if (response.data.msg.code == 0) {
            console.log('绑定信息')
            console.log(response.data.data)
            this.nowbind = response.data.data
          } else {

            this.$message.error(response.data.msg.info);
          }
        })
      },
      //点击进行签署
      tosign(){
        axios.get('/own/yunzhifu/getContractUrl',{
          params:{
            site_id:this.user.site_id
          }
        }).then((response)=>{
          if (response.data.msg.code == 0) {
            console.log('点击进行签署')
            console.log(response.data.data)
            window.open(response.data.data.sign_url,'_blank')
          } else {

            this.$message.error(response.data.msg.info);
          }
        })
      },
      //打款验证
      checkmoney(){
        this.$confirm('我们将会使用您的云账户打款1分钱到我们的个人账户，用来测试是否绑定成功，1分钱不会退款。请先确保云账户余额大于1分钱再点击测试', '提示', {
          confirmButtonText: '测试',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post('/own/yunzhifu/testApiToken',{site_id:this.user.site_id}).then((response)=>{
            if (response.data.msg.code == 0) {
              this.$message({
                message: '验证成功',
                type: 'success'
              });
              //获取详情
              this.getinfo()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });

      },
      refrestate(){
        axios.get('/own/yunzhifu/getSubmitInfo?site_id='+this.user.site_id).then((response)=>{
            if (response.data.msg.code == 0) {
              console.log('获取详情')
              //获取云账户配置
              this.getyzhinfo()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })

      }
		}
	}
</script>

<style scoped>
.t_wen{
  width: 18px;
  height: 18px;
  background-color:#9a9a9a;
  color: white;
  text-align: center;
  line-height: 18px;
  margin-left: 12px;
  border-radius: 50%;
  cursor: pointer;
}
.t_tips{
  font-size: 12px;
  color: #787778;
  margin-top: 10px;
}
/deep/.t_bf_input  .el-input__inner{
border-radius:20px 0 0 20px !important;
}
/deep/.t_bf_input  .el-input-group__append{
border-radius:0px 20px 20px 0px !important;
}
.t_yzh{
  color: #005AFF;
  background-color: #E4EDFF;
  padding: 5px 10px;
  border-radius: 25px;
  font-size: 12px;
  cursor: pointer;
}
</style>
<style scoped lang="less">
  .xitongpeizhi{
    .xiugai{background: rgb(228, 237, 255); border-radius: 14px; height: 28px; width: 52px; color: rgb(0, 90, 255); font-size: 12px;}
    /deep/ .t .el-input__inner{ border: 0 !important; padding: 0 !important; height: 50px !important; line-height: 50px !important;}
    /deep/ .tt .el-input__inner{ border: 0 !important;  height: 50px !important; line-height: 50px !important;}
    /deep/ .el-radio{ display: block; margin-bottom: 20px;}
    .t2{
      /deep/ .el-input__inner{ border-radius: 0 !important; border: 0 !important; height: 39px !important; line-height: 39px !important;;}
    }
    /deep/ .is-checked .el-checkbox__label{ color: #005aff;}
    /deep/ .el-switch.is-checked .el-switch__core{border-color: #005aff;
    background-color: #005aff;}
    /deep/ .fz12 .el-radio__label{ font-size: 12px;}
  }
</style>
